<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>颜同学的照片墙</title>
		<style>
			body
			{
				background-color: cornsilk;
			}
			.c1
			{
				width: 1100px;
				height: 40px;
				margin: 0 auto;
				background-color: cyan;
				
			}
			img
			{
				height: 300px;
				width: 300px;
			}
			.c2
			{
				width: 1100px;
				height: 1110px;
				margin: 0 auto;
				background-color: aquamarine;
			}
			.c3
			{
				float: left;
			}
			#i4,#i5,#i6
			{
				margin-top: 100px;	
			}
			#i5,#i6{
				margin-left: 100px;
			}
			#i7,#i8,#i9
			{
				margin-top: 100px;	
			}
			#i2,#i3
			{
				margin-left: 100px;
			}
			#i8,#i9
			{
				margin-left: 100px;
			}
			.c4
			{
				width: 1100px;
				height: 100px;
				margin: 0 auto;
				margin-top: 100px;
			}
		</style>
	</head>
	<body>
		<div class="c1"><center>欢迎来到颜同学的照片墙</center></div>
		<div class="c2">
			<div class="c3" id="i1"><img src="../img/y1.jpg" ></div>
			<div class="c3" id="i2"><img src="../img/y2.jpg" ></div>
			<div class="c3" id="i3"><img src="../img/y3.jpg" ></div>
			<div class="c3" id="i4"><img src="../img/y4.jpg" ></div>
			<div class="c3" id="i5"><img src="../img/y5.jpg" ></div>
			<div class="c3" id="i6"><img src="../img/y6.jpg" ></div>
			<div class="c3" id="i7"><img src="../img/y7.jpg" ></div>
			<div class="c3" id="i8"><img src="../img/y8.jpg" ></div>
			<div class="c3" id="i9"><img src="../img/y9.jpg" ></div>
		</div>
		<div class="c4">
			<center><audio src="../audio/是小陈啊 - 就是爱你.mp3" autoplay="autoplay" controls="controls" loop="loop"  ></audio></center>
		</div>
	</body>
</html>